<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit"> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 
<meta name="format-detection" content="telephone=no" /> 
<link rel="shortcut icon" href="images/logo.ico" />
<title>闪度生活</title>
<meta name="keywords" content=" " />
<meta name="description" content=" " />


<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/font-awesome.css">
<link rel="stylesheet" type="text/css" href="css/swiper-3.4.1.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css">

<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/easing.js"></script>
<script src="js/swiper-3.4.1.min.js"></script>
<script src="js/index.js"></script>
<script src="js/main.js"></script>

<script src="./js/vue.js"></script>
<script src="./js/axios.min.js"></script>
<script src="./js/axios-config.js"></script>
<script src="./js/js.cookie.js"></script>
<script src="./js/utils.js"></script>
<style>
    .bigStage_vote2_zi h5{
        font-size: 0.15rem;
        color: #ff540a;
        text-align: center;
        margin-top: 0;
        line-height: 0.25rem;
        margin-bottom: 0.06rem;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
    }
</style>

</head>

<body>
<div id="app">
<div class="pz" @click="clone_pz">
	<img src="" width="100%" />
</div>
<div class="search1_show">
    <div class="search1_show_bg"></div>
    <div class="search1_show_con">
        <input type="text" placeholder="请输入视频主题、姓名、编号...">
        <div class="search1_show_con_f1">
            <a href="##">搜索</a>
        </div>
    </div>
</div>
<!--  / header  -->
<div class="stroy_rhead">
    <a href="javascript:history.go(-1)" class="back">
      <img src="images/hl.png"> 返回
    </a>
    <span class="search"><img src="images/search.png" width="100%"></span>
    <h5>投票</h5>
    <a class="offside" href="bigStage_ranking.html">当前排名</a>
</div>
  
<!--  / header  -->


<div class="bigStage_vote">
    <div class="bigStage_vote1">
        <div class="bigStage_vote1_left"><span :class="vote == 1 ? '' : 'bigStage_vote1_active'">活动视频</span></div>
        <div class="bigStage_vote1_right"><span :class="vote == 2 ? '' : 'bigStage_vote1_active'">活动规则</span></div>
        <table style="clear:both;"></table>
    </div>
    <div :style="vote == 1 ? ('display:none') : ('display:block')" class="bigStage_vote2">
    	
    	<div class="bigStage_vote2_list clearfix" v-for="(video,index) in Videos">
    		<div class="bigStage_vote2_img">
    			<img :src="video.vo_logo" width="100%" height="128px">
    			<div class="img2_box" :style="{backgroundImage:'url('+video.pic+')'}">
	    			<!--<img :src="video.pic" width="100%">-->
    			</div>
    			<div class="bigStage_vote2_img_bg"></div>
    			<div class="bigStage_vote2_img1">
    				<div class="bigStage_vote2_img1_line"></div>
    				<div class="bigStage_vote2_img1_num">
    					<img src="images/bigStage_video_icon.png" width="100%">
    					<span>No.{{index+1}}</span>
    				</div>
    			</div>
    			
    			<div class="bigStage_vote2_img2">
    				<div class="bigStage_vote2_img2_1" @click="video_bofang(video.video)">
    					<span><i class="fa fa-play"></i></span>
    					点击播放
    				</div>
    				
    				<div class="bigStage_vote2_img2_2" @click="big_imgs(video.pic)">
    					点击放大
    				</div>
    				
    				<div class="bigStage_vote2_img2_3">
    					功能
    					<span>年龄 : 22</span>
    				</div>
    				
    			</div>
    			
    		</div>
    		<div class="bigStage_vote2_zi">
    			<h5>{{video.title}}</h5>
    			<p>{{video.rule}}</p>
    			
    			<div class="bigStage_vote2_zi_btn">
    				<p><span>编&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号 : </span>{{video.number}}</p>
    				<p><span>当前排名:</span>{{video.ranking}}</p>
    				<a v-if="video.statu == 0" href="javascript:;" style="background-color: #ff540a;" @click="Vote(video.stage_id)">投 - 票</a>
    				<a v-else href="##">无法继续投票</a>
    			</div>
    			
    		</div>
    	</div>
		
    	
    </div>
    
    <div :style="vote == 2 ? ('display:none') : ('display:block')" class="bigStage_vote3">
        <!--<h5>南山南南山南南日放大个电饭锅的山南南山南南山南南山南</h5>
        <p>撒的发生的发送的 的说法是发斯蒂芬啊是打发撒的发斯蒂芬是打发撒的发斯蒂芬大撒的发生的是打发斯蒂芬阿道夫阿什顿发的说法 </p>-->
        <iframe :src="activityRules" width="100%" height="500" frameborder="0" scrolling="no"></iframe>
    </div>

</div>

</div>
</body>
<script>
$(window).ready(function(){
	
	var vm = new Vue({
		el:"#app",
		data() {
            return {
                stage_deploy_ids: {
                	stage_deploy_id : '',
                	
                },
                Videos : [],
                activityRules:'',
                Ranking:[],
                vote:'',
            }
		},
    created: function () {
		var $this = this;
    	$this.getActivityRules();
    	$this.getActivityVideo();
    	$this.getRanking();
    	$this.vote = getCookie('vote');
    	$this.stage_deploy_ids.stage_deploy_id = getCookie('stage_deploy_id');
    	//设置文字高度
    	$('.bigStage_vote2_zi').height($(window).width()*0.45*250/330*2);
    	$('.pz').height($(window).height());
    	
    },
    mounted:function(){
    	
    },
    methods:{
    	
    	//活动规则
    	getActivityRules:function(){
    		var $this = this;
    		
    		const data = {
    			type:1
    		}
    		
    		Axios.post(window.Url.activityRules,$this.stage_deploy_ids).then((res) => {
    			
    			if(res.result == 1){
    				$this.activityRules = res.info
    			}
    			else{
    				console.log('活动规则:'+res.info);
    			}
    			
        }).catch((err) => {
          console.log('活动规则:'+err)
        })
        
        
    	},
    	//活动视频
    	getActivityVideo:function(){
    		var $this = this;
    		
    		const data = {
    			type:1
    		}
    		
    		Axios.post(window.Url.activityVideo,$this.stage_deploy_ids).then((res) => {
    			
    			if(res.result == 1){
    				$this.Videos = res.info.stage
    			}
    			else{
    				console.log('活动视频:'+res.info);
    			}
    			
        }).catch((err) => {
          console.log('活动视频:'+err);
        })
        
        
    	},
    	//排名
    	getRanking:function(){
    		var $this = this;
    		
    		const data = {
    			type:1
    		}
    		
    		Axios.post(window.Url.ranking,$this.stage_deploy_ids).then((res) => {
    			
    			if(res.result == 1){
    				$this.Ranking = res.info.stage
    			}
    			else{
    				console.log('排名:'+res.info);
    			}
    			
        }).catch((err) => {
          console.log('排名:'+err);
        })
        
        
    	},
    	//投票
    	Vote:function(stage_id){
    		var $this = this;
    		const data={
//  			'token' : getCookie('token'),
    			'stage_id' : stage_id
    		};
    		
    		Axios.post(window.Url.activityvote,data).then((res) => {
    			if(res.result == 1){
    				alert(res.info);
    				location.reload();
    				$this.vote = 1;
    			}else{
    				alert(res.info);
    			}
    			
        }).catch((err) => {
          console.log('投票:'+err);
        })
        
        
    	},
    	//视频播放
    	video_bofang:function(url){
    		setCookie('video_url',url);
    		window.location.href = 'video_bofang.html';
    	},
    	//图片放大
    	big_imgs:function(img){
    		$('.pz').show();
    		$('.pz img').attr('src',img);
    	},
    	//关闭屏障
    	clone_pz:function(){
    		$('.pz').hide();
    	}
    }
		
	})
	
	

$('.banner').height($(window).width()*400/750);



var mySwiper_banner = new Swiper ('.swiper-container-banner', {
    loop: true,
    pagination: '.swiper-pagination-banner',
	autoplay : 5000,
	autoplayDisableOnInteraction : false,
})
$('.header_map_longevity').click(function(){
    history.go(-1);
});
$('.longevity1 li').click(function(){
    window.location.href = "InformationDetails.html";
});
$(".bigStage_vote1_left").click(function(){
    $(this).children().addClass("bigStage_vote1_active");
    $(this).siblings().children().removeClass("bigStage_vote1_active");
    $(".bigStage_vote2").css("display","block");
    $(".bigStage_vote3").css("display","none");
})
$(".bigStage_vote1_right").click(function(){
    $(this).children().addClass("bigStage_vote1_active");
    $(this).siblings().children().removeClass("bigStage_vote1_active");
    $(".bigStage_vote2").css("display","none");
    $(".bigStage_vote3").css("display","block");
})

$('.search').click(function(){
      $('.search1_show').css('display','block');
})
$('.search1_show_con_f1').click(function(){
      $('.search1_show').css('display','none');
})
  
})  
</script>
</html>
